<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="../Css/bootstrap.css" />
    <link rel="stylesheet" type="text/css" href="../Css/bootstrap-responsive.css" />
    <link rel="stylesheet" type="text/css" href="../Css/style.css" />
    <script type="text/javascript" src="../Js/jquery.js"></script>
    <script type="text/javascript" src="../Js/bootstrap.js"></script>
    <script type="text/javascript" src="../Js/ckform.js"></script>
    <script type="text/javascript" src="../Js/common.js"></script>
    <script type="text/javascript" src="../Js/webUtil.js"></script>
 

    <style type="text/css">
        body {
            padding-bottom: 40px;
        }
        .sidebar-nav {
            padding: 9px 0;
        }

        @media (max-width: 980px) {
            /* Enable use of floated navbar text */
            .navbar-text.pull-right {
                float: none;
                padding-left: 5px;
                padding-right: 5px;
            }
        }


    </style>
</head>
<body>
<form id="userForm" class="definewidth m20">
<input type="hidden" name="id" id="id" />
    <table class="table table-bordered table-hover definewidth m10">
        <tr>
            <td width="10%" class="tableleft" >登录名</td>
            <td id="username">admin</td>
        </tr>
        <tr>
            <td class="tableleft">密码</td>
            <td><input type="password" name="password" id="password"/></td>
        </tr>
        <tr>
            <td class="tableleft">真实姓名</td>
            <td><input type="text" name="realName" value="admin" id="realName"/></td>
        </tr>
        <tr>
            <td class="tableleft">邮箱</td>
            <td><input type="text" name="email" value="qq@qq.com" id="email"/></td>
        </tr>
        <tr>
            <td class="tableleft">状态</td>
            <td>
                <input type="radio" name="state" value="0" checked/> 启用
              <input type="radio" name="state" value="1" /> 禁用
            </td>
        </tr>
        <tr>
            <td class="tableleft">角色</td>
            <td>
            	<select name="roleId" id="role">
        			<option value="">--请选择--
        			<option value="1" selected>管理员
        			<option value="2">院长
            		<option value="3">医生护士
       			 </select>
        	</td>
        </tr>
        <tr>
            <td class="tableleft"></td>
            <td>
                <button id="updateUser"  class="btn btn-primary" type="button">更新</button>&nbsp;&nbsp;
                <button type="button" class="btn btn-success" name="backid" id="backid">返回列表</button>
            </td>
        </tr>
    </table>
</form>
</body>
</html>
<script>
    $(function () {
        let url = document.location.toString();
        let index = url.GetValue("index");
        let id = url.GetValue("id");
        loadRoleList();
        loadUser(id);
		$('#backid').click(function(){
				window.location.href="index.html?index="+index;
		 });

		$("#updateUser").click(function () {
            $.ajax({
                type:"POST",
                url:"/user/",
                data:$("#userForm").serialize()+"&_method=PUT",
                dataType:"json",
                success:function (vo) {
                    alert(vo.msg);
                    window.location.href="index.html?index="+index;
                }
            });
        });

    });

    function loadRoleList() {
        $.ajax({
            type:"GET",
            url:"/role/all",
            data:"",
            dataType:"json",
            success: function (vo) {
                let str = '<option value="">--请选择--';
                $("#role").html(str);
                let list = vo.list;
                for (let i = 0; i <list.length; i++) {
                    let role = list[i];
                    str += '<option value="'+role.roleId+'" selected>'+role.roleName+'';
                    $("#role").html(str);
                }
            }
        });
    }

    function loadUser(id) {
        $.ajax({
            type:"GET",
            url:"/user/"+id,
            data:"",
            dataType:"json",
            success: function (vo) {
                let obj = vo.obj;
                $("#id").val(obj.id);
                $("#username").html(obj.username);
                $("#password").val(obj.password);
                $("#realName").val(obj.realName);
                $("#email").val(obj.email);
                $($(".state").eq(obj.state)).prop('checked',true);
                $($(".role")).eq(obj.role.roleId).prop('selected',true);
            }
        });
    }

</script>